<template>
	<div class="content">
		<div class="pageSearchView">
			<el-form :inline="true" :model="searchParam" class="demo-form-inline" @submit.native.prevent="getList()">
        <el-form-item style="display: none;">
          <button type="submit"></button>
        </el-form-item>
				<el-form-item label="机台">
					<el-select v-model="searchParam.id" clearable filterable placeholder="请选择机台" style="width: 180px"
										 @change="idChange">
						<el-option v-for="item in storageOutList" :key="item.id" :label="item.equipmentName" :value="item.id">
							<span style="float: left">{{ item.equipmentName }}</span>
							<span style="
                    float: right;
                    color: var(--el-text-color-secondary);
                    font-size: 13px;
                  "> {{ item.equipmentCode }} </span>
						</el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="工单号">
					<el-input placeholder="请输入工单号" v-model="searchParam.workNo" clearable style="width:150px" />
				</el-form-item>
				<el-form-item label="计划时间">
					<el-date-picker v-model="searchParam.times" type="datetimerange" range-separator="-"
													start-placeholder="计划开始时间" end-placeholder="计划结束时间" value-format="YYYY-MM-DD HH:mm:ss"
													style="width:360px" />
				</el-form-item>
				<el-form-item label="产品">
					<el-input placeholder="请输入产品名称" v-model="searchParam.productName" clearable style="width: 160px" />
				</el-form-item>
				<el-form-item label="产出物料编码">
					<el-input placeholder="请输入产出物料编码" v-model="searchParam.outMaterialNo" clearable style="width: 160px" />
				</el-form-item>
				<el-form-item>
					<el-button type="primary" :icon="Search" @click="getList()">查询</el-button>
					<el-button :icon="Refresh" @click="resetSearch()">重置</el-button>
				</el-form-item>
			</el-form>
		</div>
		<div class="pageTableView">
			<el-tabs v-model="isWorkStatusTab" class="demo-tabs" @tab-click="handleClick">
				<el-tab-pane label="未完成" name="false"></el-tab-pane>
				<el-tab-pane label="已完成" name="true"></el-tab-pane>
			</el-tabs>
<!--			<el-button @click="endClick" type="danger" :icon="SwitchButton"-->
<!--								 :disabled="reportList.length == 0"-->
<!--								 class="endButton"-->
<!--			>批量强制完结-->
<!--			</el-button>-->
			<!--      <div class="pageTableMenuView">-->
			<!--        <div class="pageTableTitle">-->
			<!--          <div>列表信息</div>-->
			<!--        </div>-->
			<!--        <div class="pageTableButView">-->
			<!--          &lt;!&ndash;          <el-button @click="handleAdd" :icon="Plus">新建</el-button>&ndash;&gt;-->
			<!--        </div>-->
			<!--      </div>-->
			<!-- 表格 -->
			<el-table ref="table" :data="paginatedData" row-key="id" :stripe="false" class="sort-el-table"
								:style="{ height: dynamicHeight }" header-cell-class-name="witheTableHeader"
								@selection-change="handleSelectionChange">
<!--				<el-table-column type="selection" width="55" align="center" />-->
				<el-table-column label="排序" fixed width="70" align="center" v-if="isWorkStatus == 'false' && searchParam.id">
					<template #default="scope">
						<el-icon class="sort-icon" style="cursor: pointer" v-if="scope.row.status !== 4">
							<Rank />
						</el-icon>
					</template>
				</el-table-column>
				<el-table-column label="序号" align="center" width="70">
					<template #default="scope"> {{ (currentPage - 1) * pageSize + scope.$index + 1 }}</template>
				</el-table-column>
        <el-table-column label="工单号" prop="workNo" min-width="200" align="center" />
				<el-table-column label="产品名称" prop="productName" min-width="200" align="center" />
				<el-table-column label="产品编码" prop="productCode" min-width="200" align="center" />
				<el-table-column label="产出物料编码" prop="outMaterialNo" min-width="200" align="center" />
				<el-table-column label="已下发数量" prop="orderCount" min-width="150" align="center" />
				<el-table-column label="单据状态" prop="status" min-width="150" align="center" :formatter="statusFormatter" />
				<el-table-column label="计划开始时间" prop="planBeginTime" min-width="200" align="center" />
				<el-table-column label="计划结束时间" prop="planEndTime" min-width="200" align="center" />
				<el-table-column label="操作" width="100" align="center" fixed="right">
					<template #default="scope">
						<!--            <el-button type="text" size="small" :icon="DocumentChecked-->
						<!--" @click="doFinish(scope.row)" v-if="scope.row.allotStatus != 3">排程-->
						<!--            </el-button>-->

						<el-button type="text" size="small" :icon="Tickets" @click="handleEdit(scope.row, 1)">详情</el-button>
<!--						<el-button link type="danger" size="small" :icon="Delete" @click="doFinish(scope.row)">删除</el-button>-->
					</template>
				</el-table-column>
			</el-table>
			<div class="pagePagination" v-if="isWorkStatus == 'true'">
				<el-pagination background layout="total,sizes,prev,pager,next" :total="pageTotal" :page-size="pageSize"
											 :current-page="currentPage" @size-change="handleSizeChange"
											 @current-change="handleCurrentChange" />
			</div>
		</div>
		<!-- 编辑/新建弹框 -->
		<el-dialog v-model="showCrud" :title="crudTitle + '调拨单'" width="1000px">
			<el-form :model="formData" label-width="100px">
				<el-row :gutter="10">
					<el-col :span="8">
						<el-form-item label="工序订单" prop="procedureOrderId">
							<el-select v-model="formData.procedureOrderId" placeholder="请选择工序订单" clearable filterable
												 style="width: 201px" :disabled="popType == 1">
								<el-option v-for="item in procedureOrderList" :key="item.id" :label="item.planNo" :value="item.id" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="出库库位">
							<el-tree-select v-model="formData.wareOutId" :data="wareList" :disabled="popType == 1" check-strictly
															clearable filterable :render-after-expand="false" :props="{
									children: 'sonList',
									label: 'warehouseName',
									value: 'id',
								}" style="width: 201px" @change="wareChangeOut" />
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="出库库位" prop="sourceStorageId">
							<el-select v-model="formData.sourceStorageId" clearable filterable :disabled="popType == 1"
												 placeholder="请选择" style="width: 201px">
								<el-option v-for="item in storageOutList" :key="item.id" :label="item.storageName" :value="item.id" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="入库库位">
							<el-tree-select v-model="formData.wareId" :data="wareList" :disabled="popType == 1" check-strictly
															clearable filterable :render-after-expand="false" :props="{
									children: 'sonList',
									label: 'warehouseName',
									value: 'id',
								}" style="width: 201px" @change="wareChange" />
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="入库库位" prop="targetStorageId">
							<el-select v-model="formData.targetStorageId" clearable filterable :disabled="popType == 1"
												 placeholder="请选择" style="width: 201px">
								<el-option v-for="item in storageList" :key="item.id" :label="item.storageName" :value="item.id" />
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="10">
					<div class="pageTableTitle">物料列表</div>
				</el-row>
				<el-row :gutter="10" style="padding: 10px">
					<el-table :data="formData.details" style="width:100% " height="calc(100vh - 600px)">
						<el-table-column label="序号" type="index" align="center" width="80" />
						<el-table-column prop="materialId" label="物料编码" align="center">
							<template #default="scope">
								<el-select v-model="scope.row.materialId" :disabled="popType == 1" placeholder="" clearable filterable>
									<el-option v-for="item in materiaList" :key="item.value" :label="item.label" :value="item.value" />
								</el-select>
							</template>
						</el-table-column>
						<el-table-column prop="materialCount" label="数量" align="center" width="150">
							<template #default="scope">
								<el-input v-model="scope.row.materialCount" type="number" :disabled="popType == 1"
													placeholder=""></el-input>
							</template>
						</el-table-column>
						<el-table-column prop="batchNo" label="批次号" align="center">
							<template #default="scope">
								<el-input v-model="scope.row.batchNo" placeholder="" :disabled="popType == 1"
													style="width: 100%"></el-input>
							</template>
						</el-table-column>
						<el-table-column align="center" width="110" fixed="right" v-if="popType != 1">
							<template #header>
								<el-button :icon="Plus" @click="handleAddConfigLine">新建</el-button>
							</template>
							<template #default="scope">
								<!--                <el-button @click="handleEditConfigLine(scope.row,scope.$index)"-->
								<!--                           plain :icon="Edit">-->
								<!--                  编辑-->
								<!--                </el-button>-->
								<el-button type="danger" plain :icon="Delete" @click="doFinish(scope.$index)"> 删除</el-button>
							</template>
						</el-table-column>
					</el-table>
				</el-row>
			</el-form>
			<template #footer>
				<span class="dialog-footer">
					<el-button @click="showCrud = false">取消</el-button>
					<el-button type="primary" @click="handleSave">保存</el-button>
				</span>
			</template>
		</el-dialog>
		<!-- 查看详情弹框 -->
		<el-dialog v-model="showDetail" :title="crudTitle + '入库单'" width="1000px">
			<el-form :model="formData" label-width="100px">
				<el-row :gutter="10">
					<el-col :span="8">
						<el-form-item label="工序订单："> {{ formData.procedureOrderName || '--' }}</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="出库库位："> {{ formData.sourceWarehouseName || '--' }}</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="出库库位："> {{ formData.sourceStorageName || '--' }}</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="入库库位："> {{ formData.targetWarehouseName || '--' }}</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="入库库位："> {{ formData.targetStorageName || '--' }}</el-form-item>
					</el-col>
				</el-row>
				<el-row :gutter="10">
					<div class="pageTableTitle">物料列表</div>
				</el-row>
				<el-row :gutter="10" style="padding: 10px">
					<el-table :data="formData.details" style="width:100% " height="calc(100vh - 600px)">
						<el-table-column label="序号" type="index" align="center" width="80" />
						<el-table-column prop="materialName" label="物料名称" align="center" />
						<el-table-column prop="materialCount" label="数量" align="center" width="150" />
						<el-table-column prop="batchNo" label="批次号" align="center" />
						<el-table-column align="center" width="110" fixed="right" v-if="popType != 1">
							<template #header>
								<el-button :icon="Plus" @click="handleAddConfigLine">新建</el-button>
							</template>
							<template #default="scope">
								<el-button type="danger" plain :icon="Delete" @click="doFinish(scope.$index)"> 删除</el-button>
							</template>
						</el-table-column>
					</el-table>
				</el-row>
			</el-form>
			<template #footer>
				<span class="dialog-footer">
					<el-button @click="showDetail = false">关闭</el-button>
				</span>
			</template>
		</el-dialog>
		<!-- 点击入库弹窗 -->
		<el-dialog v-model="showOutIn" title="出库" width="1000px">
			<el-form :model="outInForm" :rules="outInRules" ref="outInFormRef" label-width="100px">
				<el-row :gutter="10">
					<el-col :span="8">
						<el-form-item label="物料名称"> {{ outInForm.materialName || '--' }}</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="批次号"> {{ outInForm.batchNo || '--' }}</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="数量" prop="materialCount" required>
							<el-input v-model="outInForm.materialCount" type="number" placeholder=""></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="出库库位">
							<el-tree-select v-model="outInForm.wareOutId" :data="wareList" check-strictly clearable filterable
															:render-after-expand="false" :props="{
									children: 'sonList',
									label: 'warehouseName',
									value: 'id',
								}" @change="wareChangeOut" />
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="出库库位" prop="sourceStorageId">
							<el-select v-model="outInForm.sourceStorageId" clearable filterable placeholder="请选择">
								<el-option v-for="item in storageOutList" :key="item.id" :label="item.storageName" :value="item.id" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="入库库位">
							<el-tree-select v-model="outInForm.targetWarehouseId" :data="wareList" check-strictly
															:render-after-expand="false" :props="{
									children: 'sonList',
									label: 'warehouseName',
									value: 'id',
								}" @change="wareChange" />
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="入库库位" prop="targetStorageId" required>
							<el-select v-model="outInForm.targetStorageId" placeholder="请选择">
								<!--                sourceStorageId-->
								<el-option v-for="item in storageList" :key="item.id" :label="item.storageName" :value="item.id" />
							</el-select>
						</el-form-item>
					</el-col>
					<el-col :span="8">
						<el-form-item label="二维码" prop="batchNo" required>
							<el-input v-model="outInForm.batchNo" placeholder=""></el-input>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<template #footer>
				<span class="dialog-footer">
					<el-button @click="showOutIn = false">取消</el-button>
					<el-button type="primary" @click="outInSum(outInFormRef)">保存</el-button>
				</span>
			</template>
		</el-dialog>
	</div>
</template>
<script lang="ts" setup>
import { ref, computed, watch, onMounted } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import axiosInstance from '@/utils/http/api';
import {
	Delete, Edit, Tickets, DocumentChecked
	, Search, Share, Upload, Refresh, Plus, DocumentCopy, Files, Rank, SwitchButton
} from '@element-plus/icons-vue';
import type { FormInstance, FormRules } from 'element-plus';
import { equipmentAll } from '@/api/scheduling/dispatchManagement';
import Sortablejs from 'sortablejs';
import type { TabsPaneContext } from 'element-plus';

defineOptions({ name: '生产执行首页' });
const paginatedData = ref([]);
const pageSize = ref(10);
const currentPage = ref(1);
const searchParam = ref({});
const handleSizeChange = (val) => {
	pageSize.value = val;
	getList();
};
const handleCurrentChange = (val) => {
	currentPage.value = val;
	getList();
};
const isWorkStatusTab = ref('false');
const isWorkStatus = ref('false');

// 计算属性，根据isWorkStatus的值动态计算高度
const dynamicHeight = computed(() => {
	return isWorkStatus.value === 'true' ? 'calc(100vh - 327px)' : 'calc(100vh - 275px)';
});

const handleClick = (tab: TabsPaneContext, event: Event) => {
	currentPage.value = 1;
	isWorkStatus.value = tab.paneName;
	if (searchParam.value.id) {
		getList();
	}
};


const formData = ref({
	planNo: '',
	name: '',
	planBeginTime: null,
	planEndTime: null,
	actualBeginTime: null,
	actualEndTime: null,
	organizationId: '',
	status: '0',
	type: '0'
});

const crudTitle = computed(() => {
	if (popType.value === 1) {
		return '查看';
	} else {
		return isEdit.value ? '编辑' : '新建';
	}
});

const showDetail = ref(false);


// 重置搜索条件
const resetSearch = () => {
	searchParam.value.times = null;
	searchParam.value.workNo = null;
	currentPage.value = 1;
	// currentPage.value = 1
	getList();
};

const procedureOrderList = ref({});
const wareList = ref({});
const storageList = ref({});
const materiaList = ref({});
const showOutIn = ref(false);
const outInForm = ref({
	materialName: '',
	materialCount: '',
	wareId: '',
	targetStorageId: '',
	batchNo: ''
});
const outInFormRef = ref(null);
const outInRules = reactive<FormRules<outInForm>>({
	materialCount: [
		{ required: true, message: '请输入数量', trigger: 'blur' }
	],
	wareId: [
		{ required: true, message: '请选择入库库位', trigger: 'change' }
	],
	targetStorageId: [
		{ required: true, message: '请选择入库库位', trigger: 'change' }
	]
});
const reportList = ref([]);
const handleSelectionChange = (e) => {
	reportList.value = e;
};
const endClick = async () => {
	ElMessageBox.confirm('是否强制完结?', '提示', {
		confirmButtonText: '确定',
		cancelButtonText: '取消',
		type: 'error'
	})
		.then(() => {
			const promises = reportList.value.map((item) => {
				return new Promise((resolve, reject) => {
					axiosInstance.post('/api/workOrder/constraintEnd', {
						id: item.id // 假设每个对象都有一个 id 属性
					})
						.then((res) => {
							if (res.code === 200) {
								resolve(res);
							} else {
								reject(res);
							}
						})
						.catch((error) => {
							reject(error);
						});
				});
			});

			Promise.all(promises)
				.then(() => {
					ElMessage.success('所有强制完结操作已完成');
					getList();
				})
				.catch((error) => {
					ElMessage.error('强制完结操作失败');
				});
		})
		.catch(() => {
			ElMessage.info('用户取消操作');
		});
};

const handleAddConfigLine = () => {
	formData.value.details.push({
		materialId: null,
		materialCount: null,
		batchNo: null
	});
};
const outInSum = async (formEl: FormInstance | undefined) => {
	await formEl.validate((valid, fields) => {
		if (valid) {
			const param = outInForm.value;
			outFatherInfo.value.details = [param];
			outFatherInfo.value.tasks = [param];
			axiosInstance.post('/api/warehouseMaterialTransferOrder/outStock', outFatherInfo.value)
				.then((res) => {
					if (res.code !== 200) {
						ElMessage.warning(res.message);
						return false;
					}
					showOutIn.value = false;
					getList();
				});
		}
	});

};

const outFatherInfo = ref({});


const wareChange = (e, type) => {
	if (!type) {
		formData.value.targetStorageId = null;
	}
	// storageList.value = {}
	axiosInstance.post('/api/basedataStorage/listByPojoPage', {
		warehouseId: e,
		current: 1,
		pageSize: 999999
	})
		.then((res) => {
			if (res.code !== 200) {
				ElMessage.warning(res.message);
				return false;
			}
			storageList.value = res.data.records;
		});
};

const wareChangeOut = (e, type) => {
	if (!type) {
		formData.value.sourceStorageId = null;
		outInForm.value.sourceStorageId = null;
		searchParam.value.sourceStorageId = null;
	}
	// storageList.value = {}
	axiosInstance.post('/api/basedataStorage/listByPojoPage', {
		warehouseId: e,
		current: 1,
		pageSize: 999999
	})
		.then((res) => {
			if (res.code !== 200) {
				ElMessage.warning(res.message);
				return false;
			}
			storageOutList.value = res.data.records;
		});
};

const storageOutList = ref({});

const getOption = () => {
	equipmentAll().then(res => {
		console.log(res, 'equipmentAll');
		storageOutList.value = res.data;
	});

};

const statusList = ref([
	{ value: 0, label: '新建' },//
	{ value: 1, label: '待排产' },
	{ value: 2, label: '已排产' },
	{ value: 3, label: '下发' },//
	{ value: 4, label: '开工' },//
	{ value: 5, label: '中断' },//
	{ value: 6, label: '暂停' },//
	{ value: 7, label: '完成' }//
]);

const statusFormatter = (e) => {
	let statusName = '';
	for (const item of statusList.value) {
		if (item.value == e.status) {
			statusName = item.label;
		}
	}
	return statusName;
};

const isEdit = ref(false); // 是否编辑
const showCrud = ref(false); // 编辑/新建弹框

const transferType = ref({ transferType: 'pick' });

// 新建记录
const handleAdd = () => {
	popType.value = 0;
	isEdit.value = false;
	formData.value = {
		details: [{
			materialId: null,
			materialCount: null,
			batchNo: null
		}]
	};
	showCrud.value = true;
};


const popType = ref(0);//0 编辑 1 只读


const doFinish = (row) => {
	ElMessageBox.confirm('是否确认删除?', '提示', {
		confirmButtonText: '确定',
		cancelButtonText: '取消',
		type: 'error'
	})
		.then(() => {
			axiosInstance.delete('/api/workOrder/delete', {
				data: {
					ids: [row.id]
				}
			})
				.then(res => {
					if (res.code !== 200) {
						ElMessage.error(res.message);
						return false;
					}
					ElMessage.success('完结成功');
					getList();
				});
		});
};


import { useRouter } from 'vue-router';

const router = useRouter();
// 编辑记录
const
	handleEdit = (row: any, type) => {
		router.push(`/scheduling/workPlanDetail?id=${row.id}`);
		// isEdit.value = true;
		// formData.value = {...row};
		// axiosInstance.post('/api/warehouseMaterialTransferOrder/getDetailById', {id: row.id}).then(res => {
		//   if (res.code !== 200) {
		//     ElMessage.warning(res.message);
		//     return false;
		//   }
		//   formData.value.details = res.data.children
		//   if (type) {
		//     // 查看详情
		//     popType.value = type
		//     showDetail.value = true
		//   } else {
		//     // 编辑
		//     popType.value = 0
		//     showCrud.value = true;
		//   }
		//   wareChange(e.targetWarehouseId)
		// })
	};


// 保存记录
const handleSave = async () => {
	const param = formData.value;
	if (param.details.length == 0) {
		ElMessage.warning('请选择物料');
		return false;
	}
	for (const item of param.details) {
		if (!item.materialId) {
			ElMessage.warning('请选择物料');
			return false;
		}
		if (!item.materialCount || item.materialCount === 0) {
			ElMessage.warning('请输入数量');
			return false;
		}


	}
	axiosInstance.post('/api/warehouseMaterialTransferOrder/save', { ...param, ...transferType.value })
		.then((res) => {
			if (res.code !== 200) {
				ElMessage.error(res.message);
				return false;
			}
			showCrud.value = false;
			getList();
		});
};

const pageTotal = ref(0);

// 获取列表
const getList = async () => {
	// if (searchParam.value.id) {
	// 	ElMessage.error('请选择机台');
	// 	return false;
	// }
	let url = '/api/basedataEquipment/queryByWorkOrder';
	if (isWorkStatus.value == 'true') {
		url = '/api/basedataEquipment/queryByWorkOrderPage';
	}
	if (searchParam.value.times) {
		searchParam.value.queryStartTime = searchParam.value.times[0];
		searchParam.value.queryEndTime = searchParam.value.times[1];
	}
	// const isWorkStatus = isWorkStatusTab.value == 1 ? 'false' : 'true'
	axiosInstance.post(url, {
		...searchParam.value,
		current: currentPage.value,
		pageSize: pageSize.value,
		isWorkStatus: isWorkStatus.value
	})
		.then(res => {
			if (res.code !== 200) {
				ElMessage.error(res.message);
				return false;
			}
			let list = JSON.parse(JSON.stringify(res.data));
			if (isWorkStatus.value == 'true') {
				list = JSON.parse(JSON.stringify(res.data.records));
			}
			const loop = [];
			for (const item of list) {
				if (item.status != 0) {
					loop.push(item);
				}
			}
			paginatedData.value = loop;
			pageTotal.value = res.data.total;
		});
};

// const {proxy} = getCurrentInstance();
// const {task_data_aperture, risk_model_result_level} =
//     proxy.useDict("task_data_aperture", "risk_model_result_level"); // 字典项
const emit = defineEmits(['backTo', 'nextStep']);


const props = defineProps({
	taskObj: {
		type: Object,
		default: () => {
			return {};
		}
	},
	// 判断是否是编辑
	flag: {
		type: Boolean,
		default: false
	}
});


watch(() => props.taskObj, (v) => {
	// ...省略其他代码...
	nextTick(() => {
		// 进入页面后就开启表格拖拽排序
		const el = document.querySelector('.sort-el-table .el-table__body-wrapper  table tbody'); //  querySelector 方法选取页面上指定的元素。这里的选择器 '.sort-el-table .el-table__body-wrapper  table tbody' 定位到一个表格的 tbody 部分

		// 创建了一个 Sortable.js 实例，将 el 作为容器，用于拖拽排序
		Sortablejs.create(el, {
			animation: 150,
			ghostClass: 'blue-background-class',
			handle: '.sort-icon', // 指定了拖拽手柄的类名，如果需要点击某个图标拖拽的话需要吧那个图标的class写在这里
			onEnd: function(evt) { // 拖拽动作结束时触发
				let newIndex = evt.newIndex;  // 排序后的索引位置
				let oldIndex = evt.oldIndex;  // 排序前的索引位置
				if (newIndex !== oldIndex) { // 如果 newIndex 和 oldIndex 不相等，说明元素的位置发生了变化
					let currRow = paginatedData.value.splice(oldIndex, 1)[0]; // 从数组中移除原来位置的元素，并返回被移除的元素obj
					paginatedData.value.splice(newIndex, 0, currRow); // 将被移除的该元素插入到新的位置
					const param = [];
					let cando = true;
					paginatedData.value.forEach((item, index) => {
						if (item.status == 4 && index != 0) {
							cando = false;
						}
						param.push({
							index: index + 1,
							id: item.id
						});
					});

					if (cando) {
						axiosInstance.post('/api/workOrder/queryIndexOrder', param).then(res => {
							if (res.code !== 200) {
								ElMessage.error(res.message);
								return;
							}
							// ElMessage.success('排序成功')
							getList();
						});
					} else {
						getList();
						ElMessageBox.alert('已有开工工单不允许置顶', '错误', {
							// if you want to disable its autofocus
							// autofocus: false,
							confirmButtonText: '确定',
						})

					}

				}
			}
		});

	});
}, { immediate: true });

const idChange = (e) => {
	if (e) {
		localStorage.setItem('manufacturingExecId', searchParam.value.id);
		getList();
	} else {
		paginatedData.value = [];
	}
};

onMounted(() => {
	// getList();
	const id = localStorage.getItem('manufacturingExecId');
	if (id) {
		searchParam.value.id = id;
		getList();
	}
	getOption();
});
</script>
<style scoped lang="scss">
.pageTableView {
	position: relative;
}

.endButton {
	position: absolute;
	z-index: 999;
	top: 2%;
	right: 1%;

}
</style>
